<template>
  <div style="height: 100%;overflow:hidden"
       class="main">
    <!-- <x-header :left-options="{preventGoBack:true,backText: ''}" @on-click-back="backhome">隐患上报<div id="headeright"  @click="dangereport">上报</div></x-header> -->
    <x-header :left-options="{preventGoBack:true,backText: ''}"
              @on-click-back="backhome">
      安全教育早会
      <!-- <x-icon id="headeright" type="ios-plus-empty" size="30" @click="dangereport"></x-icon> -->
      <!-- <img slot="right"
           src="@/assets/img/offline_start.png"
           @click="dangereport"
           id="headeright"
      /> -->
    </x-header>
    <div class="add_form_new" @click="dangereport">发起</div>
       <!-- <div class="add_form" @click="dangereport">发起</div> -->
           
    <!-- <cell is-link
          link="prjListS1">
      <span slot="title">{{showPro(pro)}}</span>
    </cell> -->

    <div class="main-container"
         style="overflow:auto;height:86%">
      <v-touch v-on:swiperight="onSwipeRight"
               :swipe-options="{direction: 'horizontal'}">
        <!-- <scroller :on-refresh="refresh" :on-infinite="infinite" ref="taskScroller"> -->
        <!-- <scroller> -->
        <scroller>
          <!-- content -->
          <div>
            <group v-for="(item, i) in list"
                   gutter="-1px"
                   :key="i">
              <div title=""
                   :border-intent="false"
                   @click="openInfo(item)">
                <div class="more-box"
                     style="margin-left: 30px;margin-right: 30px;margin-bottom: 15px;margin-top: 15px;">
                  <div style="margin-top: 8px;">
                    <span class="gray-label"
                          style="margin-right: 10px;">项目</span>
                    {{item.PROJECTNAME}}
                  </div>
                  <div style="margin-top: 8px;">
                    <span class="gray-label"
                          style="margin-right: 10px;">填写人</span>
                    {{item.INPUTUSERFULLNAME}}
                  </div>
                  <div style="margin-top: 8px;">
                    <span class="gray-label"
                          style="margin-right: 10px;">填写时间</span>
                    {{item.INPUTDATE.substring(0,10)}}
                  </div>
                </div>
              </div>
            </group>
          </div>
        </scroller>
      </v-touch>

    </div>
    <router-view></router-view>
  </div>
</template>

<script>
export default {
  name: "safetyMeetinglist",
  // inject:['reload'],
  components: {},
  mounted () {
    this.getData();
  },
  data () {
    return {
      list: [],
      page: 1,
      keyword: '',
      createPop: false,//弹出层是否创建
      loading: false,//下拉刷新时禁止无限加载
      //currentTab:'待整改',
      //tabs:['待整改','已整改']
      pro: this.$route.query.pro,
      proId: this.$route.query.proId,
      site: this.$route.query.site,
      guid: '',
      filter: '',
     
      //proName:'',
    }
  },
  methods: {
    onSwipeRight () {
      this.$router.push("/index/home");
    },
    backhome () {
      this.$router.push("/index/home");
    },
    //获取所有项目
    getData (callback, failed) {
      var filter = "STATE<>'废弃'";
      //console.log(this.proId);
      if (!this.proId) {
        filter = "STATE<>'废弃'";
      } else {
        filter = "SYSPRJID='" + this.proId + "'and STATE<>'废弃'";
      }
     
    //  var params = '{"_method":"component.getListData","_param":{"bizObj":"PMMOBILE_DANGEREDUCATION","service":"selectMore","fields":"*","filter":"1=1","currentPageIndex":1,"pageSize":99999,"orderList":[{"field":"INPUTDATE","order":"DESC"}],"QueryFormData":""}}';
     var params = {
       _method:"component.getListData",
       _param:{
         bizObj:"PMMOBILE_DANGEREDUCATION",
         service:"selectMore",
         fields:"*",
         filter:{
           phone:{}
         },
         currentPageIndex:1,
         pageSize:99999,
         orderList:[{
           field:"INPUTDATE",
           order:"DESC"
         }],
         QueryFormData:""
       }
     }
     this.$ajax({
        method: 'post',
        url: this.COMMON_URL,// + '?_objName=PMMOBILE_DANGEREDUCATION&_viewId=PMMOBILE_DANGEREDUCATION',
        // data: this.signMD5({
        //   FixJSON: params
        // }) 
        data :{
            FixJSON :JSON.stringify(params) 
        }
      }).then((res) => {
        console.log(res)
        this.list = [...res.data.datas];
        this.page++;
      }).catch(err => {
        // failed()
      })
      // this.reload();
      //this.$router.go(0)
    },

    //打开记录信息，待修改！！！！！！！！
    openInfo (item) {
      this.$router.push({ path: '/safetyMeetingInfo1', query: { GUID: item.GUID, projectName: item.PROJECTNAME } })
    },

    infinite (done) {//上划加载方法
      // console.log("infinite");
      // console.log(this.page);

      this.getData((res) => {
        //res.data.datas中的字段都是大写的，res.data.data中的字段有小写的

        this.list = [...this.list, ...res.data.datas]//TODO 啥意思
        this.page++;
        done();
      });

    },
    refresh (done) {
      this.page = 1;
      // // console.log("refresh");
      // // console.log(this.page);
      // debugger
      // this.loading = true;
      this.getData((res) => {

        this.list = [...res.data.datas];
        this.page++;
      });
    },
    search (val) {
      this.page = 1;
      this.keyword = val;
      this.getData((res) => {
        if (res.status == '200' && res.data.datas.length > 0) {
          this.list = [...res.data.datas];
          this.page++;
        } else {
          this.list = [];
        }
      }, () => {
        this.list = [];
      });
    },
    // 发起表单
    dangereport () {
      this.$router.push({
        path: "/safetyMeetingInfo",
        query: {
        }
      });
    },
    changeType (val) {
      this.page = 1;
      this.currentTab = val;
      this.list = [];
      this.$refs.taskScroller.finishInfinite(false);
    },
    showPro (pro) {
      return !!pro ? pro : "全部项目";
    }
  },
  computed: {
    row () {//页面中使用row来指代当前记录
      // console.log(this.$store.state.currentRow);
      return this.$store.state.currentRow;
    },
  },
  watch: {
    proId: function (newId, old, Id) {
    },
  }
}
</script>

<style scoped>
/* .transition-view /deep/ .vux-header .vux-header-left .left-arrow:before {
  border-color: rgb(35, 90, 230);
}
.transition-view /deep/ .vux-header {
  background-color: rgb(255, 255, 255) !important;
}
.transition-view .vux-header /deep/ .vux-header-title {
  color: #262a34;
} */
.card {
  background: #fff;
  margin: 10px 16px;
  padding: 20px;
  border-radius: 4px;
  overflow: hidden;
}

.card-title {
  font-size: 18px;
}
.warning {
  color: red;
  padding: 0 5px;
  background-color: pink;
  text-align: center;
  width: 140px;
  line-height: 30px;
  font-size: 14px;
}

.gray-label {
  color: gray;
}

#headeright {
  position: absolute;
  right: 15px;
  top: 10px;
  display: block;
  font-size: 14px;
  line-height: 21px;
  color: #fff;
}
.box-bar:before {
  content: "";
  display: block;
  height: 17px;
  position: absolute;
  border-left: 4px solid #a7aeff;
  left: 14px;
  top: 18px;
}
.hidanger-chosetaskfontshow {
  max-width: 70px;
  overflow-x: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: inline-block;
  /*设置overflow后基线位置改变，因此需要调整*/
  vertical-align: bottom;
}
#headeright {
  position: absolute;
  right: 0px;
  top: 5px;
  display: block;
  font-size: 14px;
  line-height: 21px;
  width: 20px;
  height: 20px;
}
.changeToOffline {
  margin-right: auto;
  width: 25px;
  height: 25px;
  margin-top: 5px;
}
.add_form{
  /* position: absolute;
  height: 58px;
  width: 95%;
  top: 90%;
  z-index: 999;
  left:3%; */
  position: absolute;
  height: 50px;
  width: 90%;
  top: 90%;
  z-index: 999;
  left: 5%;
  background: #4D86FF;
  color: #ffffff;
  font-size:16px;
  font-family:PingFang SC;
  font-weight:400;
  line-height:20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* .transition-view .vux-header .vux-header-left /deep/.left-arrow:before{
   border: 1px solid rgb(228, 15, 15);
 } */
 .add_form_new {
  position: absolute;
  width:50px;
  height:50px;
  top: 80%;
  z-index: 999;
  left: 80%;
  background:rgba(77,134,255,1);
  box-shadow:0px 1px 13px 0px rgba(79,132,220,0.6);
  border-radius:50%;
  color: #ffffff;
  font-size:14px;
  font-family:PingFang SC;
  font-weight:400;
  line-height:24px;
  display: flex;
  align-items: center;
  justify-content: center;
}
</style>
